<template>
  <div class="main-logo">
    <img src="../assets/img/main-logo.png" class="logo" alt="网站Logo" />
    <img src="../assets/img/red.png" class="point" alt="" />
    <span>军事</span>
  </div>
</template>

<style scoped>
.main-logo {
  display: flex;
  align-items: flex-end; /* 使用flex-end对齐底部 */
  justify-content: center;
  padding: 21px 0 45px 0;
  min-height: 148px;
  width: 1200px;

  .logo {
    width: 119px;
    height: 38px;
    vertical-align: bottom;
    display: inline-block;
  }

  .point {
    width: 10px;
    height: 10px;
    margin: 0 30px;
    vertical-align: bottom;
    align-self: flex-end;
    margin-bottom: 12px;
  }

  span {
    font-size: 80px;
    color: #bd0509;
    vertical-align: bottom;
    line-height: 1;
    display: inline-block;
    margin-bottom: -5px;
  }
}
</style>